/**
 * #info
 *
 *@author   wuwg
 *@createTime   2018/03/20
 *@updateTime   2018/04/24
 *@description  dropdown-item  component  下拉菜单条目的组件
 */

/**
 * #item
 *
 * @type        aty-dropdown-item
 * @cn          下拉条目
 * @stPlugin    false
 * @stContainer true
 * @parents     [aty-dropdown-menu]
 */
import config from '../../../../config/config.js'

// prefix
const prefixCls = config.prefix + '-dropdown-item'
// module
const module = {
  name: prefixCls,
  components: {},
  props: {
    /**
     * #property
     *
     * @name    index
     * @cn      索引值
     * @type    number
     * @description 索引值，循环中用到，用于查找是哪条数据
     */
    index: {
      type: Number
    },
    /**
     * #property
     *
     * @name    data
     * @cn      下拉菜单条目的数据
     * @type    object
     * @bind    must
     * @value   {}
     * @description 下拉菜单条目的数据。数据全部字段为
     *
     * {
     * code:1,    // 代码值
     * disabled:true||false,  // 是否禁用
     * selected:true||false,  // 是否选中
     * divided:true||false,  // 是否有分割线
     * name:'中国人'   // !important  此必须字段，其他的为可选字段，用户也可以自己朝对象中增加其他字段
     * }
     */
    data: {
      type: Object,
      default () {
        return {}
      }
    }
  },
  data () {
    return {
      currentData: this.data,
      scope: {
        className: prefixCls
      }
    }
  },
  watch: {
    data: {
      deep: true,
      handler (newValue, oldValue) {
        this.currentData = newValue
      }
    }
  },
  computed: {
    classes () {
      return [
                `${prefixCls}`,
                {
                  [`${prefixCls}-disabled`]: this.currentData.disabled,
                  [`${prefixCls}-selected`]: this.currentData.selected,
                  [`${prefixCls}-divided`]: this.currentData.divided
                }
      ]
    }
  },
  methods: {
    handleClick () {
      const $parent = this.$parent.$parent.$parent
      //  const hasChildren = this.$parent && this.$parent.$options.name === 'Dropdown';
      if (!this.currentData.disabled) {
        // 触发父级的点击事件
        $parent.$emit('click', this.currentData, this.index)
        // 隐藏弹出层
        this.$nextTick(() => {
          $parent.currentVisible = false
        })
      }
      /*
       * else if (hasChildren) {
       * this.$parent.$emit('on-haschild-click');
       * } else {
       * if ($parent && $parent.$options.name === 'Dropdown') {
       * $parent.$emit('on-hover-click');
       * }
       * }
       */
    }
  }
}
export default module
